<template>
  <div>
    <a-button type="primary" @click="showModal">点击登录</a-button>
    <a-modal
      title="Title"
      :visible="visible"
      :confirm-loading="confirmLoading"
      @ok="handleOk"
      @cancel="handleCancel"
    >
    <p>账号：admin   密码：123</p>
      <a-form
        :form="form"
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 12 }"
        @submit="handleSubmit"
      >
        <a-form-item label="账户">
          <a-input
            v-decorator="['account', { rules: [{ required: true, message: 'Please input your note!' }] }]"
          />
        </a-form-item>
        <a-form-item label="密码">
          <a-input
            v-decorator="['password', { rules: [{ required: true, message: 'Please input your note!' }] }]"
          />
        </a-form-item>
        <a-form-item :wrapper-col="{ span: 12, offset: 5 }">
      <a-button type="primary" html-type="submit">
        Submit
      </a-button>
    </a-form-item>
  </a-form>
      
    </a-modal>
  </div>
</template>

<script>
// import { Password } from 'ant-design-vue/types/input/password';
export default {
  data() {
    return {
      ModalText: "Content of the modal",
      visible: false,
      confirmLoading: false,
       formLayout: 'horizontal',
      form: this.$form.createForm(this, { name: 'coordinated' }),
    };
  },
  methods: {
       handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
          
        if (!err) {
            if  (values.account!='admin'||values.password !='123'){
                alert('账户密码错误')
                return
            }
          
          localStorage.setItem('loginState', 1)
          alert('登录成功点击跳转')
          this.$router.push('/workerList')
        }
      });
    },
    showModal() {
      this.visible = true;
    },
    handleOk(e) {
      this.ModalText = "The modal will be closed after two seconds";
      this.confirmLoading = true;
      setTimeout(() => {
        this.visible = false;
        this.confirmLoading = false;
      }, 2000);
    },
    handleCancel(e) {
      console.log("Clicked cancel button");
      this.visible = false;
    }
  }
};
</script>